<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>学生网课管理系统</title>
    <link href="css/StudentCourse.css" rel="stylesheet">
</head>
<body>
<div id="app">
    <el-container>
        <el-aside>
            <el-menu
                    default-active="1"
                    class="el-menu-vertical-demo"
                    @open="handleOpen"
                    @close="handleClose"
                    background-color="#545c64"
                    text-color="#fff"
                    active-text-color="#ffd04b">
                <div class="block" style="text-align: center">
                    <el-avatar :size="100" :src="circleUrl"></el-avatar>
                    <br>
                    <p>欢迎！{{studentInfo.name}}同学！</p>
                </div>
                <el-menu-item index="1" @click="showStudentInfo">
                    <svg t="1654349772655" class="icon" viewBox="0 0 1024 1024" version="1.1"
                         xmlns="http://www.w3.org/2000/svg" p-id="1792" width="200" height="200">
                        <path d="M681.472 548.864A252.928 252.928 0 0 0 768 358.4 256 256 0 0 0 256 358.4a252.928 252.928 0 0 0 86.528 190.464A409.6 409.6 0 0 0 102.4 921.6h819.2a409.6 409.6 0 0 0-240.128-372.736zM512 204.8a153.6 153.6 0 1 1-153.6 153.6 153.6 153.6 0 0 1 153.6-153.6zM223.744 819.2a307.2 307.2 0 0 1 576.512 0z"
                              fill="" p-id="1793"></path>
                    </svg>
                    <span slot="title">个人信息</span>
                </el-menu-item>
                <el-menu-item index="2" @click="showCourseSelect">
                    <svg t="1654527419361" class="icon" viewBox="0 0 1024 1024" version="1.1"
                         xmlns="http://www.w3.org/2000/svg" p-id="18764" width="200" height="200">
                        <path d="M763.424 912H260.576A99.312 99.312 0 0 1 160 814V324a99.312 99.312 0 0 1 100.576-98H336v-48.992h67.728A134.56 134.56 0 0 1 512 128a134.576 134.576 0 0 1 108.272 49.008H688V226h75.424A99.312 99.312 0 0 1 864 324v490a99.312 99.312 0 0 1-100.576 98zM637.712 226H581.84c0-27.056-31.264-48.992-69.84-48.992S442.16 198.944 442.16 226h-55.872v98h251.424v-98z m176 98a49.6 49.6 0 0 0-50.288-49.008H688v98H336v-97.984h-75.424a49.6 49.6 0 0 0-50.288 49.008V814a49.6 49.6 0 0 0 50.288 49.008h502.848a49.6 49.6 0 0 0 50.288-48.992V324zM688 765.008H336a24.512 24.512 0 1 1 0-48.992h352a24.512 24.512 0 1 1 0 48.992z m0-122.496H336a24.512 24.512 0 1 1 0-49.008h352a24.512 24.512 0 1 1 0 48.992zM688 520H336a24.512 24.512 0 1 1 0-49.008h352A24.512 24.512 0 1 1 688 520z"
                              fill="" p-id="18765"></path>
                    </svg>
                    <span slot="title">我要选课</span>
                </el-menu-item>
                <el-menu-item index="3" @click="showCourseTable">
                    <svg t="1654527453959" class="icon" viewBox="0 0 1024 1024" version="1.1"
                         xmlns="http://www.w3.org/2000/svg" p-id="19076" width="200" height="200">
                        <path d="M213.4272 241.501867a24.2176 24.2176 0 0 1-24.209067-24.221867 24.2176 24.2176 0 0 1 24.209067-24.226133h32.277333a24.2176 24.2176 0 0 1 24.209067 24.226133 24.2176 24.2176 0 0 1-24.209067 24.221867h-32.277333z m572.936533 0a24.2176 24.2176 0 0 1-24.209066-24.221867 24.2176 24.2176 0 0 1 24.209066-24.226133h24.209067c40.110933 0 72.6272 32.5376 72.6272 72.674133v549.0688c0 40.132267-32.512 72.669867-72.6272 72.669867H213.4272C173.312 887.466667 140.8 854.929067 140.8 814.7968V265.728c0-40.136533 32.512-72.674133 72.6272-72.674133a24.2176 24.2176 0 0 1 24.209067 24.226133 24.2176 24.2176 0 0 1-24.209067 24.221867 24.2176 24.2176 0 0 0-24.209067 24.226133v549.0688a24.2176 24.2176 0 0 0 24.209067 24.221867h597.1456a24.2176 24.2176 0 0 0 24.209067-24.221867V265.728a24.2176 24.2176 0 0 0-24.209067-24.226133h-24.209067z"
                              p-id="19077"></path>
                        <path d="M326.4 136.533333a24.209067 24.209067 0 0 1 24.209067 24.209067v100.962133a24.209067 24.209067 0 1 1-48.418134 0V160.7424A24.209067 24.209067 0 0 1 326.4 136.533333z m371.2 0a24.209067 24.209067 0 0 1 24.209067 24.209067v100.962133a24.209067 24.209067 0 1 1-48.418134 0V160.7424A24.209067 24.209067 0 0 1 697.6 136.533333z m-56.405333 80.746667a24.209067 24.209067 0 0 1-24.209067 24.209067H407.0144a24.209067 24.209067 0 1 1 0-48.418134h209.9712a24.209067 24.209067 0 0 1 24.209067 24.209067z m222.050133 185.7152a24.209067 24.209067 0 0 1-24.209067 24.209067H180.928a24.209067 24.209067 0 1 1 0-48.418134H839.04a24.209067 24.209067 0 0 1 24.209067 24.209067z m-109.009067 209.937067a24.209067 24.209067 0 0 1-24.209066 24.209066H293.973333a24.209067 24.209067 0 1 1 0-48.418133h436.053334a24.209067 24.209067 0 0 1 24.209066 24.209067z"
                              p-id="19078"></path>
                    </svg>
                    <span slot="title">我的课表</span>
                </el-menu-item>
                <el-menu-item index="4" @click="showSelectedCourses">
                    <svg t="1654349992936" class="icon" viewBox="0 0 1024 1024" version="1.1"
                         xmlns="http://www.w3.org/2000/svg" p-id="5957" width="200" height="200">
                        <path d="M270.277 250.937h-0.004c0-21.347 17.328-38.653 38.68-38.653h406.096c21.347 0 38.675 17.305 38.675 38.653L782.732 444.3h37.304l-27.637-193.34c0-42.74-34.635-77.375-77.352-77.375H308.951c-42.722 0-77.355 34.635-77.355 77.375L203.98 444.3h37.285l29.01-193.363z"
                              p-id="5958"></path>
                        <path d="M308.947 371.393c0 16.032 12.994 29.01 29.008 29.01H686.04c16.014 0 29.01-12.978 29.01-29.01 0-16.01-12.995-9.667-29.01-9.667H337.955c-16.014 0-29.008-6.346-29.008 9.667zM666.701 303.71c16.014 0 29.01-12.996 29.01-29.005 0-16.013-12.995-9.672-29.01-9.672H357.293c-16.013 0-29.01-6.342-29.01 9.672 0 16.01 12.996 29.004 29.01 29.004h309.408zM811.74 482.993H212.259c-42.717 0-77.351 34.634-77.351 77.374l19.337 212.697c0 42.738 34.635 77.35 77.352 77.35h560.803c42.721 0 77.355-34.612 77.355-77.35l19.338-212.697c0-42.739-34.634-77.374-77.351-77.374zM618.36 705.362c0 16.014-12.996 29.009-28.987 29.009H434.627c-15.992 0-28.986-12.994-28.986-29.01 0-16.009 12.994-29.004 29.007-29.004H589.35c16.013 0 29.01 12.995 29.01 29.005z"
                              p-id="5959"></path>
                    </svg>
                    <span slot="title">我的选课</span>
                </el-menu-item>
                <el-submenu index="5">
                    <template slot="title">
                        <svg t="1654350048198" class="icon" viewBox="0 0 1024 1024" version="1.1"
                             xmlns="http://www.w3.org/2000/svg" p-id="6812" width="200" height="200">
                            <path d="M635.635 1022.928c-39.368 0-72.301-23.406-90.471-64.289-8.202-18.422-17.35-24.29-23.533-27.066-10.852-4.984-18.864-3.596-29.274 4.353-8.391 6.372-14.006 13.438-17.097 21.577-18.612 47.949-67.885 72.932-118.925 63.216-48.706-9.148-87.506-26.182-118.673-51.986-22.46-18.675-35.33-39.873-39.368-64.92-3.47-21.64 1.956-39.936 7.129-53.437 4.227-11.167 7.445-20.378 7.066-28.895-0.442-8.328-6.688-15.709-14.321-16.719-14.7-1.956-29.968 1.451-45.046 4.921-42.333 9.653-79.935-4.227-105.55-38.422C20.507 735.237 5.176 694.481 2.084 650.129c-3.47-48.643 17.791-85.361 59.873-103.215 15.015-6.372 25.299-15.583 31.356-28.075 5.363-11.041 2.208-16.277-1.199-20.252-11.861-14.258-17.602-17.728-20-18.612C12.179 458.839-7.127 396.38 4.671 345.719c7.382-31.924 18.675-68.831 45.993-100.376 27.192-31.293 60.63-42.649 96.97-32.239l6.814 1.956c11.23 3.281 20.883 6.057 29.463 6.057 29.968-1.893 31.103-18.548 31.608-25.678l0.757-12.113c0.315-2.587-0.442-21.514-2.713-30.599-9.779-38.8 3.028-75.077 36.151-102.017 32.807-26.75 72.743-42.144 125.739-48.453 43.532-5.236 77.159 15.142 95.96 55.267 6.183 12.997 11.104 20.694 17.034 26.435 14.826 14.321 44.605 5.93 53.816-13.186 5.552-11.482 12.744-22.965 21.324-34.195 20.567-26.687 51.166-39.053 85.74-34.069 32.176 4.795 73.879 14.132 109.84 44.037 20.504 17.034 40.441 37.286 46.939 69.336 4.669 23.028-2.082 42.333-7.066 56.403-3.218 9.274-4.416 17.35-3.659 25.425 1.199 13.249 14.069 25.804 27.003 26.245 11.482-0.946 22.712-1.956 32.807-6.183 13.88-5.741 27.76-8.643 41.198-8.643 21.955 0 53.564 7.634 79.746 44.1 24.479 34.132 38.737 74.573 43.721 123.594 4.353 42.649-17.665 78.106-60.314 97.159-9.148 4.101-16.277 9.085-22.145 15.457-7.571 8.076-10.599 18.675-8.58 29.274 1.956 10.41 8.643 18.99 18.233 23.596 17.35 8.139 37.034 19.306 51.923 39.747 17.539 23.848 23.596 52.239 17.981 84.225-4.921 28.643-15.079 70.85-46.056 106.244-29.274 33.438-61.134 40.504-82.711 40.504-9.148 0-18.612-1.262-28.012-3.659-15.773-4.101-31.987-8.012-48.264-4.858-6.877 1.262-15.646 11.167-16.088 18.296-0.82 11.924 0.252 20.504 3.407 27.633 20.504 46.245 4.795 99.178-38.169 128.704-33.501 22.965-71.166 37.412-112.048 42.901C644.468 1022.676 639.989 1022.928 635.635 1022.928zM510.086 855.802c13.943 0 27.949 3.091 41.639 9.274 26.372 11.987 46.561 33.501 60.062 63.973 9.337 20.946 20.252 20.946 23.848 20.946l3.659-0.252c29.842-3.975 56.15-14.069 80.503-30.788 10.599-7.255 20.315-21.892 12.744-39.053-10.599-23.974-10.536-46.876-9.527-62.018 2.776-40.63 36.151-77.979 75.897-85.172 28.958-5.237 57.349 0.315 79.43 5.994 10.347 2.587 19.242 6.751 37.665-14.258 14.574-16.593 23.533-38.422 29.085-70.661 2.713-15.52-1.009-23.217-4.984-28.643-5.047-6.94-13.375-11.798-24.29-16.971-30.851-14.574-52.239-42.207-58.674-75.771-6.435-33.69 3.344-67.443 26.75-92.553 12.492-13.501 27.444-24.164 45.74-32.428 19.179-8.517 18.233-17.413 17.665-23.28-3.659-36.024-13.628-64.92-30.473-88.389-9.842-13.691-17.539-13.691-20.441-13.691-3.785 0-8.265 1.009-13.186 3.091-18.801 7.823-38.359 11.798-57.917 11.798-55.519-2.019-98.042-42.712-102.585-92.742-1.64-18.548 0.82-36.908 7.571-56.024 2.461-7.129 5.047-14.448 4.353-17.791-1.956-9.527-9.274-17.097-22.082-27.76-17.476-14.511-39.558-22.839-74.005-27.949-8.643-0.505-12.744 0.757-17.034 6.309-5.615 7.318-10.158 14.511-13.564 21.514-18.17 37.728-57.349 62.144-99.745 62.144-26.624 0-51.671-10.031-70.535-28.264-15.773-15.331-25.11-32.744-32.239-47.759-6.624-14.195-13.186-14.195-17.476-14.195-42.523 4.858-70.535 15.205-92.175 32.807-14.132 11.545-13.564 19.432-11.419 27.823 3.407 13.754 5.11 42.333 5.11 42.333l0.126 2.145-1.262 21.009c-3.722 52.996-41.892 89.651-97.348 93.31l-7.066 0.189c-18.927 0-35.33-4.732-49.778-8.959l-6.372-1.83c-7.255-0.82-12.555-0.946-21.955 9.842-16.845 19.432-24.416 44.731-30.094 69.147-3.596 15.457-1.073 41.261 20.694 48.958 22.334 7.886 39.368 25.804 51.734 40.567 23.596 28.264 27.507 64.352 10.788 98.925-13.943 28.706-36.971 49.967-68.453 63.342-9.464 4.038-17.161 9.148-15.583 30.977 2.082 30.157 12.492 57.854 30.977 82.459 11.987 15.962 20.252 13.628 30.914 11.167 21.324-4.921 45.551-9.59 71.039-6.183 42.712 5.615 75.33 41.64 77.475 85.613 1.009 22.523-5.236 41.072-11.735 58.169-2.902 7.697-3.848 12.303-3.218 15.962 0.82 5.3 3.091 11.419 13.943 20.441 21.577 17.918 48.832 29.463 85.613 36.403 2.965 0.568 5.93 0.82 8.896 0.82 21.135 0 26.624-14.006 28.391-18.612 7.949-20.757 21.829-38.8 41.072-53.437C467.563 863.184 488.32 855.802 510.086 855.802z"
                                  p-id="6813"></path>
                            <path d="M508.193 756.499c-133.373 0-242.266-110.092-242.708-245.358-0.442-135.833 106.244-243.528 242.96-245.231l0 0c136.212 0 245.421 109.524 246.493 244.159 1.136 134.571-108.452 245.105-244.222 246.43L508.193 756.499zM511.537 338.842c-98.358 1.199-173.435 76.781-173.119 172.047 0.315 95.203 76.465 172.678 169.776 172.678l1.767 0c95.645-0.946 172.804-78.484 172.047-172.867C681.25 415.938 604.784 338.842 511.537 338.842z"
                                  p-id="6814"></path>
                        </svg>
                        <span slot="title">设置</span>
                    </template>
                    <el-menu-item index="5-1" @click="showChangePassword">
                        <svg t="1654521792324" class="icon" viewBox="0 0 1024 1024" version="1.1"
                             xmlns="http://www.w3.org/2000/svg" p-id="2196" width="200" height="200">
                            <path d="M768 947.2H256a102.4 102.4 0 0 1-102.4-102.4v-358.4a102.4 102.4 0 0 1 102.4-102.4v-51.2a256 256 0 0 1 506.88-51.2h-106.496A153.6 153.6 0 0 0 358.4 332.8v51.2h409.6a102.4 102.4 0 0 1 102.4 102.4v358.4a102.4 102.4 0 0 1-102.4 102.4z m0-460.8H256v358.4h512z m-256 51.2a102.4 102.4 0 0 1 102.4 102.4 102.4 102.4 0 0 1-51.2 88.064v65.536H460.8v-65.536a102.4 102.4 0 0 1-51.2-88.064 102.4 102.4 0 0 1 102.4-102.4z"
                                  fill="" p-id="2197"></path>
                        </svg>
                        <span slot="title">修改密码</span>
                    </el-menu-item>
                </el-submenu>
                <el-menu-item index="6" @click="studentSignOut">
                    <svg t="1654350081908" class="icon" viewBox="0 0 1042 1024" version="1.1"
                         xmlns="http://www.w3.org/2000/svg" p-id="7655" width="200" height="200">
                        <path d="M581.632 697.344l126.976 0 0 194.56q0 33.792-10.24 58.88t-27.136 40.96-39.424 23.552-48.128 7.68l-452.608 0q-24.576 0-48.128-9.728t-41.472-27.136-29.184-40.96-11.264-52.224l0-706.56q0-24.576 11.776-47.104t30.208-39.936 40.96-28.16 45.056-10.752l449.536 0q26.624 0 50.176 11.776t41.472 29.696 28.16 40.448 10.24 44.032l0 188.416-126.976 0 1.024-195.584-452.608 0-1.024 713.728 452.608 0 0-195.584zM1021.952 505.856q37.888 30.72 2.048 60.416-20.48 15.36-44.544 37.888t-50.176 46.592-51.712 47.616-47.104 40.96q-23.552 18.432-40.448 18.432t-16.896-24.576q2.048-14.336 0.512-35.84t-1.536-36.864q0-17.408-12.288-21.504t-29.696-4.096l-40.96 0-62.464 0q-34.816 0-73.216-0.512t-73.216-0.512l-62.464 0-41.984 0q-8.192 0-17.92-1.536t-17.408-6.656-12.288-14.336-4.608-23.552q0-19.456-0.512-46.08t0.512-47.104q0-27.648 13.312-37.888t43.008-9.216l33.792 0 59.392 0q32.768 0 70.144 0.512t71.168 0.512l61.44 0 38.912 0q25.6 1.024 43.52-4.096t17.92-22.528q0-14.336 1.024-32.256t1.024-32.256q0-23.552 12.8-29.696t32.256 9.216q19.456 16.384 45.568 38.4t52.736 45.056 52.736 45.568 47.616 39.936z"
                              p-id="7656"></path>
                    </svg>
                    <span slot="title">退出登录</span>
                </el-menu-item>
            </el-menu>
        </el-aside>

        <el-main v-show="studentInfoShow">
            <el-descriptions class="margin-top" title="学生信息" :column="2" :size="size" border>
                <el-descriptions-item>
                    <template slot="label">
                        <svg t="1654412093602" class="icon" viewBox="0 0 1024 1024" version="1.1"
                             xmlns="http://www.w3.org/2000/svg" p-id="3609" width="200" height="200">
                            <path d="M421.738667 348.032l-234.666667-0.021333a21.333333 21.333333 0 0 1 0-42.666667l234.666667 0.021333a21.333333 21.333333 0 0 1 0 42.666667zM485.738667 433.365333h-298.666667a21.333333 21.333333 0 0 1 0-42.666666h298.666667a21.333333 21.333333 0 0 1 0 42.666666zM357.738667 517.397333h-170.666667a21.333333 21.333333 0 0 1 0-42.666666h170.666667a21.333333 21.333333 0 0 1 0 42.666666zM710.72 687.744c-70.592 0-128-57.408-128-128s57.408-128 128-128 128 57.408 128 128-57.408 128-128 128z m0-213.333333c-47.061333 0-85.333333 38.272-85.333333 85.333333s38.272 85.333333 85.333333 85.333333 85.333333-38.272 85.333333-85.333333c0-47.04-38.272-85.333333-85.333333-85.333333z"
                                  fill="#666666" p-id="3610"></path>
                            <path d="M892.053333 856.96h-42.666666c0-82.325333-62.208-149.333333-138.666667-149.333333s-138.666667 67.008-138.666667 149.333333h-42.666666c0-105.877333 81.344-192 181.333333-192s181.333333 86.122667 181.333333 192z"
                                  fill="#666666" p-id="3611"></path>
                            <path d="M891.221333 860.928h-725.333333c-47.061333 0-85.333333-38.272-85.333333-85.333333v-116.906667a21.333333 21.333333 0 1 1 42.666666 0v116.906667c0 23.530667 19.136 42.666667 42.666667 42.666666h725.333333c23.530667 0 42.666667-19.136 42.666667-42.666666v-554.666667c0-23.530667-19.136-42.666667-42.666667-42.666667h-725.333333c-23.530667 0-42.666667 19.136-42.666667 42.666667v245.781333a21.333333 21.333333 0 0 1-42.666666 0V220.928c0-47.061333 38.272-85.333333 85.333333-85.333333h725.333333c47.061333 0 85.333333 38.272 85.333334 85.333333v554.666667c0 47.061333-38.272 85.333333-85.333334 85.333333z"
                                  fill="#666666" p-id="3612"></path>
                            <path d="M100.778667 562.709333m-32 0a32 32 0 1 0 64 0 32 32 0 1 0-64 0Z" fill="#666666"
                                  p-id="3613"></path>
                        </svg>
                        学号
                    </template>
                    {{studentInfo.id}}
                </el-descriptions-item>
                <el-descriptions-item>
                    <template slot="label">
                        <i class="el-icon-user"></i>
                        姓名
                    </template>
                    {{studentInfo.name}}
                </el-descriptions-item>
                <el-descriptions-item>
                    <template slot="label">
                        <i class="el-icon-location-outline"></i>
                        电话
                    </template>
                    {{studentInfo.phone}}
                    <el-link type="primary" @click="changePhone">{{changeInfoMsg.phone}}</el-link>
                </el-descriptions-item>
                <el-descriptions-item>
                    <template slot="label">
                        <svg t="1654414436950" class="icon" viewBox="0 0 1024 1024" version="1.1"
                             xmlns="http://www.w3.org/2000/svg" p-id="7560" width="200" height="200">
                            <path d="M838.954667 234.666667H170.666667c-3.626667 0-7.168 0.448-10.56 1.322666l323.690666 323.669334a21.333333 21.333333 0 0 0 30.165334 0L838.954667 234.666667z m46.144 14.186666l-260.693334 260.693334 262.933334 262.912c5.44-7.168 8.661333-16.106667 8.661333-25.792V277.333333c0-10.944-4.117333-20.906667-10.88-28.48zM843.861333 789.333333l-249.6-249.621333-50.133333 50.133333a64 64 0 0 1-90.517333 0l-50.112-50.133333L156.373333 786.88c4.48 1.578667 9.28 2.453333 14.314667 2.453333h673.194667zM128.661333 754.218667L373.333333 509.525333 129.578667 265.813333A42.709333 42.709333 0 0 0 128 277.333333v469.333334c0 2.56 0.213333 5.098667 0.661333 7.552zM170.666667 192h682.666666a85.333333 85.333333 0 0 1 85.333334 85.333333v469.333334a85.333333 85.333333 0 0 1-85.333334 85.333333H170.666667a85.333333 85.333333 0 0 1-85.333334-85.333333V277.333333a85.333333 85.333333 0 0 1 85.333334-85.333333z"
                                  fill="#333333" p-id="7561"></path>
                        </svg>
                        邮箱
                    </template>
                    {{studentInfo.email}}
                    <el-link type="primary" @click="changeEmail">{{changeInfoMsg.email}}</el-link>
                </el-descriptions-item>
                <el-descriptions-item>
                    <template slot="label">
                        <i class="el-icon-tickets"></i>
                        身份
                    </template>
                    <el-tag size="small">学生</el-tag>
                </el-descriptions-item>
                <el-descriptions-item>
                    <template slot="label">
                        <svg t="1654526319626" class="icon" viewBox="0 0 1024 1024" version="1.1"
                             xmlns="http://www.w3.org/2000/svg" p-id="18448" width="200" height="200">
                            <path d="M491.725628 1023.999815a103.769453 103.769453 0 0 1-63.461191-21.576558L61.610729 720.56099a104.33596 104.33596 0 0 1-19.138111-146.343746L449.311434 45.037371a104.803945 104.803945 0 0 1 120.764687-33.571746 82.586987 82.586987 0 0 0 36.712169 5.972963L825.004636 0.3202a96.811259 96.811259 0 0 1 103.030529 79.200255l40.899401 222.686832a49.12608 49.12608 0 0 0 10.431133 22.167697 103.83103 103.83103 0 0 1 2.019724 129.742604L574.558922 983.297461a104.237437 104.237437 0 0 1-82.833294 40.702354z m-27.574152-68.264191a45.49304 45.49304 0 0 0 63.719813-8.362148l406.838816-529.192188a45.222102 45.222102 0 0 0-0.849761-56.490681 107.821215 107.821215 0 0 1-22.832728-48.867457L870.115899 90.136319a38.066862 38.066862 0 0 0-40.505308-31.133299L611.394245 76.146039a140.88803 140.88803 0 0 1-62.808475-9.85231 45.640825 45.640825 0 0 0-52.586703 14.63068L89.160251 610.153544a45.443779 45.443779 0 0 0 8.349832 63.719813l366.641393 281.862267z"
                                  p-id="18449"></path>
                            <path d="M651.333046 472.332045a146.122069 146.122069 0 1 1 116.134101-57.069504 145.136838 145.136838 0 0 1-96.885151 55.813335 146.799415 146.799415 0 0 1-19.24895 1.256169z m0.467984-227.317417a82.291417 82.291417 0 0 0-10.689756 0.701978 81.195348 81.195348 0 1 0 74.88987 129.988911 81.207663 81.207663 0 0 0-64.200114-130.690889z"
                                  p-id="18450"></path>
                        </svg>
                        专业班级
                    </template>
                    {{studentInfo.majorName}}
                </el-descriptions-item>
                <el-descriptions-item>
                    <template slot="label">
                        <svg t="1654412675224" class="icon" viewBox="0 0 1028 1024" version="1.1"
                             xmlns="http://www.w3.org/2000/svg" p-id="6701" width="200" height="200">
                            <path d="M32.57709 364.8c6.4 0 12.8 0 19.2-6.4l70.4-44.8c0 6.4 6.4 6.4 12.8 6.4h755.2c6.4 0 12.8 0 19.2-6.4l70.4 44.8c6.4 6.4 12.8 6.4 19.2 6.4 12.8 0 19.2-6.4 25.6-12.8 6.4-12.8 6.4-32-12.8-44.8l-480-300.8c-12.8-6.4-25.6-6.4-32 0l-486.4 294.4c-12.8 12.8-19.2 32-6.4 44.8 6.4 12.8 12.8 19.2 25.6 19.2z m179.2-108.8l300.8-185.6 300.8 185.6h-601.6z m-83.2 576h192V384h-192v448z m64-390.4h64v339.2h-64V441.6z m448 390.4V384h-256v448h256z m-192-390.4h128v339.2h-128V441.6z m256 390.4h192V384h-192v448z m64-390.4h64v339.2h-64V441.6zM0.57709 896h1024v128H0.57709z"
                                  p-id="6702"></path>
                            <path d="M512.57709 64l-320 192 640 64V192z" p-id="6703"></path>
                        </svg>
                        院系
                    </template>
                    {{studentInfo.departmentName}}
                </el-descriptions-item>
            </el-descriptions>
            <br>
            <el-descriptions class="margin-top" title="学分统计" :column="2" :size="size" border>
                <el-descriptions-item>
                    <template slot="label">
                        <svg t="1654542122258" class="icon" viewBox="0 0 1024 1024" version="1.1"
                             xmlns="http://www.w3.org/2000/svg" p-id="11573" width="200" height="200">
                            <path d="M233.344 474.816h124.16V412.16h-63.168c-7.552 19.008-15.36 36.032-23.488 51.008a178.24 178.24 0 0 0-26.24-13.44 415.04 415.04 0 0 0 43.52-114.048l29.248 6.4c-4.352 15.616-8.96 30.336-13.696 44.224h53.76v-65.28h29.312v65.28h97.92v25.856h-97.92v62.656h115.84v25.856H414.208v80.256c0 13.248 5.504 19.84 16.512 19.84h17.92c11.52 0 18.176-5.952 19.904-17.92 1.536-9.792 2.88-24.512 4.16-44.288 7.68 3.52 17.28 7.104 28.48 10.88-1.984 17.28-4.096 31.744-6.4 43.52-3.968 22.208-18.24 33.344-42.752 33.344H424.32c-25.984 0-39.04-14.08-39.04-42.368v-83.2h-50.432c-0.128 11.328-0.384 21.44-0.896 30.336-1.536 46.72-27.776 81.344-78.72 103.872a494.976 494.976 0 0 0-18.816-25.152c44.032-18.24 66.88-44.48 68.672-78.72 0.448-7.488 0.896-17.664 1.28-30.4h-72.96V474.88z m56.32 177.024l78.336 0.704 137.984-2.56a996.48 996.48 0 0 1-10.496 29.568l-130.688 1.536-78.528-1.152c-44.992-1.472-76.16-16.64-93.44-45.376-10.24 9.472-25.216 26.24-44.928 50.24l-15.36-31.104c22.08-21.376 38.08-36.672 48-45.952V481.536h-44.672v-27.712h73.472v160.32c15.36 24.576 42.176 37.12 80.256 37.696zM179.328 327.808c12.736 15.488 30.208 39.104 52.48 70.848l-26.624 18.752a1205.248 1205.248 0 0 0-49.92-73.472l24.064-16.128z m474.368 99.008a346.624 346.624 0 0 0 70.144-105.728l26.944 8.256a481.408 481.408 0 0 1-15.36 29.952h123.776v23.68a299.2 299.2 0 0 1-62.848 66.56c25.024 12.992 56.448 22.784 94.336 29.44-4.032 6.464-8.32 15.68-13.12 27.712-45.44-11.392-80.512-24.832-105.408-40.32-27.328 17.408-62.336 33.6-104.96 48.576a398.592 398.592 0 0 0-15.744-24.384c38.72-10.24 71.68-23.552 99.008-39.936a242.432 242.432 0 0 1-43.712-45.568 396.224 396.224 0 0 1-32.064 39.36 184.192 184.192 0 0 0-20.992-17.6zM516.864 503.296A677.12 677.12 0 0 0 586.24 321.088l27.776 5.248c-7.68 29.248-16 56.64-25.152 82.304v280.704h-26.624V473.856a532.672 532.672 0 0 1-33.344 61.312 400.96 400.96 0 0 0-12.032-31.872z m340.16 70.528l16.832 20.608c-59.712 46.72-128.704 79.616-206.976 98.624a231.168 231.168 0 0 0-14.976-24.32c78.208-18.56 146.56-50.176 205.12-94.912z m-238.528 34.496v-227.2h25.856v227.2h-25.856z m204.8-79.104l17.6 20.224c-43.008 32.256-94.4 59.52-154.176 81.728a237.056 237.056 0 0 0-16.832-23.232c62.464-20.224 113.6-46.528 153.344-78.72z m-36.48-38.272l18.048 19.136a539.072 539.072 0 0 1-122.24 61.44 101.632 101.632 0 0 0-16.896-22.4 395.2 395.2 0 0 0 121.152-58.24z m38.336-108.352h-103.36l-0.384 0.704c14.912 21.376 32.192 38.72 51.968 51.968 22.272-16.64 39.488-34.176 51.776-52.672z"
                                  p-id="11574"></path>
                            <path d="M128 0h768a128 128 0 0 1 128 128v768a128 128 0 0 1-128 128H128a128 128 0 0 1-128-128V128a128 128 0 0 1 128-128z m0 64a64 64 0 0 0-64 64v768a64 64 0 0 0 64 64h768a64 64 0 0 0 64-64V128a64 64 0 0 0-64-64H128z"
                                  p-id="11575"></path>
                        </svg>
                        选修课
                    </template>
                    {{creditInfo.electiveSum}}分
                </el-descriptions-item>
                <el-descriptions-item>
                    <template slot="label">
                        <svg t="1654542089990" class="icon" viewBox="0 0 1024 1024" version="1.1"
                             xmlns="http://www.w3.org/2000/svg" p-id="10699" width="200" height="200">
                            <path d="M135.104 637.184a738.24 738.24 0 0 0 97.92-60.352V384.448h29.248v169.664a675.008 675.008 0 0 0 168-204.16l28.16 14.208c-51.456 91.648-116.8 168.192-196.16 229.76v22.656c0 17.28 8 25.856 24 25.856h94.464c16.768 0 26.496-8.256 29.248-24.768 2.24-9.984 4.16-26.24 5.632-48.704 12.288 4.992 22.528 8.704 30.72 11.2a434.688 434.688 0 0 1-9.344 52.48c-6.272 25.024-23.232 37.568-51.008 37.568H278.72c-30.464 0-45.696-16-45.696-48v-6.784c-24.512 17.024-50.176 32.768-76.928 47.232a198.912 198.912 0 0 0-20.992-25.472z m42.368-210.752l28.928 8.96c-14.72 58.24-28.672 102.784-41.6 133.568a287.872 287.872 0 0 0-28.16-12.032c14.464-35.968 28.16-79.488 40.832-130.496z m245.248 37.12l26.24-12.8c20.288 35.84 38.784 71.68 55.552 107.712l-29.632 16.128a1381.76 1381.76 0 0 0-52.16-111.04zM273.92 339.392l20.992-19.072c23.04 20.48 45.504 42.112 67.52 64.896l-23.232 21.76a1078.4 1078.4 0 0 0-65.28-67.52z m379.904 87.424a346.624 346.624 0 0 0 70.144-105.728l26.944 8.256a481.408 481.408 0 0 1-15.36 29.952h123.776v23.68a299.2 299.2 0 0 1-62.848 66.56c25.024 12.992 56.448 22.784 94.336 29.44-4.032 6.464-8.32 15.68-13.12 27.712-45.44-11.392-80.512-24.832-105.408-40.32-27.328 17.408-62.336 33.6-104.96 48.576a398.592 398.592 0 0 0-15.744-24.384c38.72-10.24 71.68-23.552 99.008-39.936a242.432 242.432 0 0 1-43.712-45.568 396.224 396.224 0 0 1-32.064 39.36 184.192 184.192 0 0 0-20.992-17.6zM516.864 503.296A677.12 677.12 0 0 0 586.24 321.088l27.776 5.248c-7.68 29.248-16 56.64-25.152 82.304v280.704h-26.624V473.856a532.672 532.672 0 0 1-33.344 61.312 400.96 400.96 0 0 0-12.032-31.872z m340.16 70.528l16.832 20.608c-59.712 46.72-128.704 79.616-206.976 98.624a231.168 231.168 0 0 0-14.976-24.32c78.208-18.56 146.56-50.176 205.12-94.912z m-238.528 34.496v-227.2h25.856v227.2h-25.856z m204.8-79.104l17.6 20.224c-43.008 32.256-94.4 59.52-154.176 81.728a237.056 237.056 0 0 0-16.832-23.232c62.464-20.224 113.6-46.528 153.344-78.72z m-36.48-38.272l18.048 19.136a539.072 539.072 0 0 1-122.24 61.44 101.632 101.632 0 0 0-16.896-22.4 395.2 395.2 0 0 0 121.152-58.24z m38.336-108.352h-103.36l-0.384 0.704c14.912 21.376 32.192 38.72 51.968 51.968 22.272-16.64 39.488-34.176 51.776-52.672z"
                                  p-id="10700"></path>
                            <path d="M128 0h768a128 128 0 0 1 128 128v768a128 128 0 0 1-128 128H128a128 128 0 0 1-128-128V128a128 128 0 0 1 128-128z m0 64a64 64 0 0 0-64 64v768a64 64 0 0 0 64 64h768a64 64 0 0 0 64-64V128a64 64 0 0 0-64-64H128z"
                                  p-id="10701"></path>
                        </svg>
                        必修课
                    </template>
                    {{creditInfo.requiredSum}}分
                </el-descriptions-item>
            </el-descriptions>
        </el-main>

        <el-main v-show="courseSelectShow">

            <el-form :inline="true" :model="selectQuery">
                <el-form-item label="课程ID">
                    <el-input
                            @blur="changeSearchInfo"
                            v-model="selectQuery.id"
                            placeholder="填写一个数字">
                    </el-input>
                </el-form-item>
                <el-form-item label="课程名">
                    <el-input
                            v-model="selectQuery.name"
                            placeholder="填入关键字"
                            :disabled="inputDisable">
                    </el-input>
                </el-form-item>
                <el-form-item label="任课老师">
                    <el-input
                            v-model="selectQuery.teacherName"
                            placeholder="填入关键字"
                            :disabled="inputDisable">
                    </el-input>
                </el-form-item>
                <el-form-item label="类型">
                    <el-select
                            clearable
                            v-model="selectQuery.type"
                            placeholder="请选择"
                            :disabled="inputDisable">
                        <el-option label="选修课" value="选修课"></el-option>
                        <el-option label="必修课" value="必修课"></el-option>
                    </el-select>
                </el-form-item>
                <el-form-item>
                    <el-button type="primary" @click="onSubmit">{{searchInfo}}</el-button>
                </el-form-item>
                <el-button type="info" @click="loadAllCourses">刷新列表</el-button>
            </el-form>


            <template>
                <el-table
                        :data="coursesForSelect.slice((currentPageAll-1)*pageSizeAll,currentPageAll*pageSizeAll)"
                        empty-text="没有可选的课程！">
                    <el-table-column
                            prop="id"
                            label="课程ID">
                    </el-table-column>
                    <el-table-column
                            prop="name"
                            label="课程名">
                    </el-table-column>
                    <el-table-column
                            prop="credit"
                            label="总学分">
                    </el-table-column>
                    <el-table-column
                            prop="courseTime"
                            label="上课时间">
                    </el-table-column>
                    <el-table-column
                            prop="teacherName"
                            label="任课老师">
                    </el-table-column>
                    <el-table-column
                            prop="departmentName"
                            label="所属学院">
                    </el-table-column>
                    <el-table-column
                            prop="type"
                            label="类型">
                    </el-table-column>
                    <el-table-column label="操作">
                        <template slot-scope="scope">
                            <el-button
                                    :disabled="coursesForSelect[scope.$index].btnDisabled"
                                    :type="coursesForSelect[scope.$index].btnType"
                                    size="medium"
                                    @click="selectCourse(scope.$index, scope.row)">
                                {{coursesForSelect[scope.$index].btnInfo}}
                            </el-button>
                        </template>
                    </el-table-column>
                </el-table>
                <div class="block">
                    <el-pagination
                            @size-change="handleSizeChangeAll"
                            @current-change="handleCurrentChangeAll"
                            :current-page="currentPageAll"
                            :page-sizes="[5, 10, 15, 20]"
                            :page-size="pageSizeAll"
                            layout="total, sizes, prev, pager, next, jumper"
                            :total="coursesForSelect.length">
                    </el-pagination>
                </div>
            </template>

        </el-main>
        <el-main v-show="courseTableShow">

            <template>
                <el-table
                        :data="courseTableData"
                        border
                        size="mini">
                    <el-table-column
                            align="center"
                            type="index"
                            :index="indexMethod"
                            width="50"
                    >
                    </el-table-column>
                    <el-table-column
                            prop="mon"
                            label="星期一">
                    </el-table-column>
                    <el-table-column
                            prop="feb"
                            label="星期二">
                    </el-table-column>
                    <el-table-column
                            prop="wed"
                            label="星期三">
                    </el-table-column>
                    <el-table-column
                            prop="thu"
                            label="星期四">
                    </el-table-column>
                    <el-table-column
                            prop="fri"
                            label="星期五">
                    </el-table-column>
                    <el-table-column
                            prop="sat"
                            label="星期六">
                    </el-table-column>
                    <el-table-column
                            prop="sun"
                            label="星期日">
                    </el-table-column>
                </el-table>
            </template>

        </el-main>
        <el-main v-show="selectedCoursesShow">

            <template>
                <el-table
                        :data="coursesSelected.slice((currentPageSelected-1)*pageSizeSelected,currentPageSelected*pageSizeSelected)"
                        empty-text="您还没有选课！">
                    <el-table-column
                            prop="id"
                            label="课程ID">
                    </el-table-column>
                    <el-table-column
                            prop="name"
                            label="课程名">
                    </el-table-column>
                    <el-table-column
                            prop="credit"
                            label="总学分">
                    </el-table-column>
                    <el-table-column
                            prop="courseTime"
                            label="上课时间">
                    </el-table-column>
                    <el-table-column
                            prop="teacherName"
                            label="任课老师">
                    </el-table-column>
                    <el-table-column
                            prop="departmentName"
                            label="所属学院">
                    </el-table-column>
                    <el-table-column
                            prop="type"
                            label="类型">
                    </el-table-column>
                    <el-table-column label="操作">
                        <template slot-scope="scope">
                            <el-button
                                    type="danger"
                                    size="medium"
                                    @click="deleteCourse(scope.$index, scope.row)">
                                退选
                            </el-button>
                        </template>
                    </el-table-column>
                </el-table>
                <div class="block">
                    <el-pagination
                            @size-change="handleSizeChangeSelected"
                            @current-change="handleCurrentChangeSelected"
                            :current-page="currentPageSelected"
                            :page-sizes="[5, 10, 15, 20]"
                            :page-size="pageSizeSelected"
                            layout="total, sizes, prev, pager, next, jumper"
                            :total="coursesSelected.length">
                    </el-pagination>
                </div>
            </template>
        </el-main>
        <el-main v-show="changePasswordShow">
            <el-form :model="updatedStudentPassword" status-icon :rules="rules" ref="updatedTeacherPassword"
                     label-width="100px" class="demo-ruleForm">
                <el-form-item label="旧密码" prop="oldPassword">
                    <el-input type="password" v-model="updatedStudentPassword.oldPassword"></el-input>
                </el-form-item>
                <el-form-item label="密码" prop="password">
                    <el-input type="password" v-model="updatedStudentPassword.password"
                              autocomplete="off"></el-input>
                </el-form-item>
                <el-form-item label="确认密码" prop="checkPassword">
                    <el-input type="password" v-model="updatedStudentPassword.checkPassword"
                              autocomplete="off"></el-input>
                </el-form-item>
                <el-form-item>
                    <el-button type="primary" @click="submitStudentPassword">提交</el-button>
                </el-form-item>
            </el-form>
        </el-main>
    </el-container>

</div>

<script src="js/vue.js"></script>
<script src="js/axios-0.18.0.js"></script>
<link rel="stylesheet" href="element-ui/lib/theme-chalk/index.css">
<script src="element-ui/lib/index.js"></script>
<script src="js/iconfont.js"></script>

<script>
    const student_id = location.href.split("?")[1];
    new Vue({
        el: "#app",
        data() {
            let validatePass = (rule, value, callback) => {
                if (value === '') {
                    callback(new Error('请再次输入密码'));
                } else if (value !== this.updatedStudentPassword.password) {
                    callback(new Error('两次输入密码不一致!'));
                } else {
                    callback();
                }
            };
            return {
                size: 'large',
                circleUrl: "https://cube.elemecdn.com/3/7c/3ea6beec64369c2642b92c6726f1epng.png",
                studentInfoShow: false,
                selectedCoursesShow: false,
                courseSelectShow: false,
                courseTableShow: false,
                changePasswordShow: false,
                inputEmail: "",
                inputPhone: "",
                changeInfoMsg: {'phone': '修改','email': '修改'},
                courseTableData: [],
                coursesForSelect: [],
                coursesSelected: [],
                selectQuery: {},
                studentInfo: {},
                creditInfo: {},
                updatedStudentPassword: {},
                searchInfo: "查询",
                inputDisable: false,
                currentPageAll: 1,
                pageSizeAll: 5,
                currentPageSelected: 1,
                pageSizeSelected: 5,
                rules: {
                    oldPassword: [
                        {required: true, message: '旧密码不能为空！' , trigger: 'blur'}
                    ],
                    password: [
                        {required: true, message: '新密码不能为空！' , trigger: 'blur'},
                        {pattern: /^[a-zA-Z0-9]{5,17}$/, message: '密码5-17位,由字母，数字组成！',trigger: 'blur'},
                    ],
                    checkPassword: [
                        {validator: validatePass, trigger: 'blur'}
                    ],
                }
            }
        },
        mounted() {
            this.studentInfoShow = true
            this.refresh()
        },
        methods: {
            handleOpen(key, keyPath) {
                console.log(key, keyPath);
            },
            handleClose(key, keyPath) {
                console.log(key, keyPath);
            },
            showStudentInfo() {

                this.courseSelectShow = false
                this.selectedCoursesShow = false
                this.courseTableShow = false
                this.changePasswordShow = false
                this.studentInfoShow = true
            },
            showCourseSelect() {
                this.studentInfoShow = false

                this.selectedCoursesShow = false
                this.courseTableShow = false
                this.changePasswordShow = false
                this.courseSelectShow = true
            },
            showSelectedCourses() {
                this.studentInfoShow = false
                this.courseSelectShow = false

                this.courseTableShow = false
                this.changePasswordShow = false
                this.selectedCoursesShow = true
            },
            showCourseTable() {
                this.studentInfoShow = false
                this.courseSelectShow = false
                this.selectedCoursesShow = false

                this.changePasswordShow = false
                this.courseTableShow = true
            },
            showChangePassword() {
                this.studentInfoShow = false
                this.courseSelectShow = false
                this.selectedCoursesShow = false
                this.courseTableShow = false
                this.changePasswordShow = true
            },
            studentSignOut() {
                this.$confirm('此操作您将退出登录, 是否继续?', '警告', {
                    confirmButtonText: '退出',
                    cancelButtonText: '取消',
                    type: 'warning'
                }).then(() => {
                    location.href = "http://localhost:8080/coursesystem/login.html"
                }).catch(() => {
                    this.$message({
                        type: "info",
                        message: "已取消该操作"
                    })
                })
            },
            getStudentInfo() {
                var _this = this
                var param = new URLSearchParams()
                param.append('studentId', student_id)
                param.append('q', 'studentInfo')
                axios({
                    method: 'post',
                    url: '/coursesystem/StudentServlet',
                    data: param
                }).then(function (resp) {
                    _this.studentInfo = resp.data
                    let phone = _this.studentInfo.phone
                    let email = _this.studentInfo.email
                    if (phone === ""||phone === undefined) _this.changeInfoMsg.phone = '点我绑定'
                    else _this.changeInfoMsg.phone = '修改'
                    if (email === ""||email === undefined) _this.changeInfoMsg.email = '点我绑定'
                    else _this.changeInfoMsg.email = '修改'
                })
            },
            changeEmail(){
                let _this = this
                this.$prompt('请输入邮箱','提示',{
                    confirmButtonText: '提交',
                    cancelButtonText: '取消',
                    inputPattern: /^\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*$/,
                    inputErrorMessage: '邮箱格式不正确！'
                }).then(({ value }) => {
                    let param = new URLSearchParams()
                    param.append('user_id', student_id)
                    param.append('q', 'email')
                    param.append('query', value)
                    axios({
                        method: "post",
                        url: "/coursesystem/StudentQueryServlet",
                        data: param
                    }).then(function (resp) {
                        let res = resp.data
                        if (res === "ok"){
                            _this.$message({
                                type: 'success',
                                message: '邮箱修改成功！'
                            })
                            _this.refresh()
                        }else if (res === 'same'){
                            _this.$message({
                                type: 'warning',
                                message: '邮箱已被占用！'
                            })
                        }else{
                            _this.$message({
                                type: 'info',
                                message: '出错了?!'
                            })
                        }
                    }).catch(() => {
                        this.$message({
                            type: 'info',
                            message: '已取消输入'
                        })
                    })
                })
            },
            changePhone(){
                let _this = this
                this.$prompt('请输入电话','提示',{
                    confirmButtonText: '提交',
                    cancelButtonText: '取消',
                    inputPattern: /^(13[0-9]|14[01456879]|15[0-35-9]|16[2567]|17[0-8]|18[0-9]|19[0-35-9])\d{8}$/,
                    inputErrorMessage: '电话格式不正确！'
                }).then(({ value }) => {
                    let param = new URLSearchParams()
                    param.append('user_id', student_id)
                    param.append('q', 'phone')
                    param.append('query', value)
                    axios({
                        method: "post",
                        url: "/coursesystem/StudentQueryServlet",
                        data: param
                    }).then(function (resp) {
                        let res = resp.data
                        if (res === "ok"){
                            _this.$message({
                                type: 'success',
                                message: '电话修改成功！'
                            })
                            _this.refresh()
                        }else if (res === 'same'){
                            _this.$message({
                                type: 'warning',
                                message: '电话已被占用！'
                            })
                        }else{
                            _this.$message({
                                type: 'info',
                                message: '出错了?!'
                            })
                        }
                    }).catch(() => {
                        this.$message({
                            type: 'info',
                            message: '已取消输入'
                        })
                    })
                })
            },
            getCreditInfo() {
                let sum1 = 0
                let sum2 = 0
                for (let i = 0; i < this.coursesSelected.length; i++) {
                    if (this.coursesSelected[i].type === '选修课') {
                        sum1 += parseInt(this.coursesSelected[i].credit)
                    } else if (this.coursesSelected[i].type === '必修课') {
                        sum2 += parseInt(this.coursesSelected[i].credit)
                    }
                }
                this.creditInfo.electiveSum = sum1
                this.creditInfo.requiredSum = sum2
            },
            indexMethod(index) {
                return "第" + (2 * index + 1) + ",\n" + (2 * (index + 1)) + "节"
            },
            refresh() {
                this.loadAllCourses()
                this.loadAllSelected()
                this.loadCourseTable()
                this.getStudentInfo()
                // this.$message({
                //     type: 'success',
                //     message: '数据加载成功！'
                // })
            },
            deleteCourse(index, row) {
                this.$confirm('此操作将退选该门课程, 是否继续?', '警告', {
                    confirmButtonText: '确定',
                    cancelButtonText: '取消',
                    type: 'warning'
                }).then(() => {
                    var _this = this
                    var param = new URLSearchParams()
                    param.append("courseId", row.id)
                    param.append("studentId", student_id)
                    param.append("q", "delete")
                    axios({
                        method: "post",
                        url: "/coursesystem/StudentServlet",
                        data: param
                    }).then(function (resp) {
                        if (resp.data === 'success') {
                            _this.$message({
                                type: 'success',
                                message: '退选成功！'
                            })
                        } else {
                            _this.$message({
                                type: 'error',
                                message: '系统错误！'
                            })
                        }
                        _this.refresh()
                    })
                }).catch(() => {
                    this.$message({
                        type: 'info',
                        message: '已取消该操作'
                    })
                })
            },
            selectCourse(index, row) {
                this.$confirm('是否选择该门课程？', '提示', {
                    confirmButtonText: '确定',
                    cancelButtonText: '取消',
                    type: 'info'
                }).then(() => {
                    var _this = this
                    var param = new URLSearchParams();
                    param.append("courseId", row.id)
                    param.append("studentId", student_id)
                    param.append("q", "select")
                    axios({
                        method: "post",
                        url: "/coursesystem/StudentServlet",
                        data: param
                    }).then(function (resp) {
                        if (resp.data === 'success') {
                            _this.$message({
                                type: 'success',
                                message: '选课成功！'
                            })
                        } else {
                            _this.$message({
                                type: 'error',
                                message: '系统错误！'
                            })
                        }
                        _this.refresh()
                    })
                }).catch(() => {
                    this.$message({
                        type: 'info',
                        message: '已取消该操作'
                    })
                })

            },
            loadAllCourses() {
                var _this = this
                var param = new URLSearchParams()
                param.append("studentId", student_id)
                param.append("q", "allCourses")
                axios({
                    method: "post",
                    url: "/coursesystem/StudentServlet",
                    data: param
                }).then(function (resp) {
                    _this.coursesForSelect = resp.data
                })
            },
            loadCourseTable() {
                var _this = this
                var param = new URLSearchParams()
                param.append("q", "courseTable")
                param.append("studentId", student_id)
                axios({
                    method: "post",
                    url: "/coursesystem/StudentServlet",
                    data: param
                }).then(function (resp) {
                    _this.courseTableData = resp.data
                })
            },
            loadAllSelected() {
                var _this = this
                var param = new URLSearchParams()
                param.append("studentId", student_id)
                param.append("q", "allSelected")
                axios({
                    method: "post",
                    url: "/coursesystem/StudentServlet",
                    data: param
                }).then(function (resp) {
                    _this.coursesSelected = resp.data
                    _this.getCreditInfo()
                })
            },
            onSubmit() {
                var _this = this
                var param = new URLSearchParams();
                param.append("user_id", student_id);
                param.append('q','select')
                if (this.inputDisable) {
                    param.append("query", JSON.stringify({id: _this.selectQuery.id}));
                    axios({
                        method: "post",
                        url: "/coursesystem/StudentQueryServlet",
                        data: param
                    }).then(function (resp) {
                        _this.coursesForSelect = resp.data
                        _this.$message({
                            type: 'success',
                            message: '查询成功！'
                        })
                    })
                } else if (_this.selectQuery.name === "" && _this.selectQuery.teacherName === "" && _this.selectQuery.type === "") {
                    _this.loadAllCourses()
                } else {
                    if (_this.selectQuery.id === "") {
                        _this.selectQuery.id = "-1"
                    }
                    param.append("query", JSON.stringify(_this.selectQuery));
                    axios({
                        method: "post",
                        url: "/coursesystem/StudentQueryServlet",
                        data: param
                    }).then(function (resp) {
                        _this.coursesForSelect = resp.data
                        _this.$message({
                            type: 'success',
                            message: '查询成功！'
                        })
                    })
                }
                this.selectQuery = {}
                this.inputDisable = false
                this.searchInfo = "查询"
            },
            submitStudentPassword() {
                let param = new URLSearchParams()
                param.append('user_id', student_id)
                param.append('query', JSON.stringify({
                    oldPassword: this.updatedStudentPassword.oldPassword,
                    password: this.updatedStudentPassword.password}))
                param.append('q','password')
                let _this = this
                axios({
                    method: 'post',
                    url: "/coursesystem/StudentQueryServlet",
                    data: param
                }).then(function (resp) {
                    if (resp.data === 'ok'){
                        _this.$message({
                            type: 'success',
                            message: '密码修改成功！'
                        })
                    }else if (resp.data === 'wrongPassword'){
                        _this.$message({
                            type: 'warning',
                            message: '原始密码输入错误！请重试！'
                        })
                    }else{
                        _this.$message({
                            type: 'info',
                            message: '未知错误?!'
                        })
                    }
                    _this.updatedStudentPassword = {}
                })
            },
            changeSearchInfo() {
                if (this.selectQuery.id === undefined) {
                    this.searchInfo = "查询"
                    this.inputDisable = false
                } else {
                    this.searchInfo = "课程ID精确查询"
                    this.inputDisable = true
                }
            },
            handleSizeChangeAll(val) {
                console.log(`每页${val}条`)
                this.pageSizeAll = val
            },
            handleCurrentChangeAll(val) {
                console.log(`当前第${val}页`)
                this.currentPageAll = val
            },
            handleSizeChangeSelected(val) {
                this.pageSizeSelected = val
            },
            handleCurrentChangeSelected(val) {
                this.currentPageSelected = val
            }
        }
    })
</script>
</body>
</html>